<template>
	<view class="warp">
		<c-navBar title="上传凭证" isSeat></c-navBar>

		<view class="content">
			<!-- 上传图片 -->
			<view class="upload-img">
				<p class="upload-p">凭证上传<text style="font-size: 24rpx;">（限6张）</text></p>
				<view class="upload">
					<c-upLoadImgs :file.sync="images" maxCount='6' width='160rpx' height="160rpx"></c-upLoadImgs>
				</view>
			</view>
			<!-- 备注 -->
			<view class="notes-box">
				<p class="notes-boxP">温馨提示</p>
				<p class="notes-boxP1">上传付款成功截图，由人工审核以后自动认证其庄主身份</p>

			</view>
			<!-- 送达按钮 -->
			<view class="send-button" @click="uplodInfo">
				确认上传
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				urlPdf: '', //合同地址
				num: '', //亩数
				code: '', //邀请码
				memberType: '', //会员类型
				images: null,
			}
		},
		onLoad(options) {
			// this.type = options.type
			this.urlPdf = options.urlPdf
			this.num = options.num
			this.code = options.code
			this.memberType = options.memberType
		},
		methods: {
			 uplodInfo() {
				let imgInfo = null
				if (typeof this.images == "string") {
					imgInfo =this.vuex_imgUrl + this.images
				} else if (Array.isArray(this.images)) {
					let newArr = this.images.map(item => {
						return this.vuex_imgUrl + item
					})
					imgInfo = newArr.join(',')
				}
				console.log(imgInfo,"imgInfo");
				if (imgInfo == null) {
					uni.showToast({
						title: "请上传凭证",
						icon: "error",
						duration: 1000
					})
				} else {
					this.$api.payOffline({
						num: this.num,
						type: this.memberType,
						contractUrl: this.urlPdf,
						imgs: imgInfo,
						code:this.code,
					}).then(res => {
						console.log(res, "上传");
	
						if (res.code == 200) {
							uni.showToast({
								title: "上传成功",
								icon: "success",
								duration: 1000
							})
							setTimeout(() => {
								uni.reLaunch({
									url:'/pages/my/pages/recordBuy'
								})
							}, 1000)
						}
					})
				}

			}
		}
	}
</script>

<style scoped lang="scss">
	.warp {
		width: 100vw;
		min-height: 100vh;
		padding-top: 200rpx;
		box-sizing: border-box;
	}


	.content {
		padding-left: 40rpx;
		box-sizing: border-box;

		.upload-img {
			// height: 208rpx;
			width: 670rpx;
			// margin-left: 20rpx;
			border-bottom: 1rpx solid #E6E6E6;
			padding-bottom: 32rpx;
			box-sizing: border-box;

			.upload-p {
				font-size: 28rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 500;
				color: #333333;
			}

			.upload {
				width: 670rpx;
				// height: 30rpx;
				margin-top: 20rpx;
				// background-color: yellow;
			}


		}

		.notes-box {
			width: 670rpx;
			height: 288rpx;
			// margin-left: 20rpx;
			padding-top: 40rpx;
			// padding-right: 20rpx;
			box-sizing: border-box;

			.notes-boxP {
				font-size: 28rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: bold;
				color: #1A1A1A;
			}

			.notes-boxP1 {
				font-size: 24rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				color: #666666;
				margin-top: 20rpx;
			}


		}

		.send-button {
			width: 686rpx;
			height: 96rpx;
			background: linear-gradient(135deg, #2AD03D 0%, #00B815 100%);
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			font-size: 36rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: bold;
			color: #FFFFFF;
			display: flex;
			align-items: center;
			justify-content: center;
			position: fixed;
			bottom: 68rpx;
			left: 50%;
			transform: translate(-50%, 0);

		}



	}

	::v-deep .u-textarea.data-v-09988a29 {
		background-color: #F7F7F7;
		border: none;

	}
</style>